<template>
    <div>
        <div class="header-title">
            <span @click="$router.go(-1)" class="mint-toast-icon mintui mintui-back"></span>
            <span>解绑邮箱</span>
            <span></span>
        </div>
        <div class="num-list">
            <div class="input-area">
                <span>邮箱</span>
                <span>{{phoneRegister.accounts}}</span>
            </div>
            <div class="input-code">
                <input v-model="phoneRegister.code" type="text" name="" id="" placeholder="请输入短信验证码">
                <span class="code" @click="getCodeFather">
                    <getEmailCode :phone = phoneRegister.accounts ref="childCode"></getEmailCode>
                </span>
            </div>
            <p class="msg-one">
                邮箱不可用？
                <span>联系我们</span>
            </p>
            <mt-button
                @click="phoneUnbind"
                size="normal"
                class="submit-btn"
            >解除绑定</mt-button>
        </div>
    </div>
</template>
<script>
import getEmailCode from "../../../components/getEmailCode";
import { Toast } from "mint-ui";
export default {
    data(){
        return{
            token:JSON.parse(this.$store.state.userMsg).token,
            //手机号验证
            phoneRegister: {
                accounts: JSON.parse(this.$store.state.userMsg).mailbox,
                code: ""
            },
        }
    },
    components: {
        getEmailCode
    },
    methods: {
        //获取验证码
        getCodeFather() {
            this.$refs.childCode.getCodeChild();
        },
        // 解除邮箱绑定
        phoneUnbind(){
            if (this.phoneRegister.code == "" ) {
                    Toast({ message: "验证码不能为空！" });
                    return false;
            }
            var params = {
                token:this.token,
                verificationCode :this.phoneRegister.code,
                type :'1'
            }
            this.$axios.post(this.address.removeBinding,params).then(res => {
                console.log(res.data)
                if(res.data.code == 200){
                    Toast({ message: "解绑成功！" });
                    //改变存储的user信息
                    var users = JSON.parse(this.$store.state.userMsg)
                    users.mailbox = ''
                    this.$store.commit('getUserMsg',JSON.stringify(users))

                    this.$router.push({ name: "safetyCenter" });
                }else{
                    Toast({ message: res.data.msg });
                }
            })
        },
    }
};
</script>
<style lang="less" scoped>
.num-list {
    padding: 15px;
    box-sizing: border-box;
}
</style>
